<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <script src="https://cdn.jsdelivr.net/npm/vue@2"></script>
    <!-- 引入样式 -->
    <link href="https://unpkg.com/element-ui/lib/theme-chalk/index.css" rel="stylesheet">
    <!-- 引入组件库 -->
    <script src="https://unpkg.com/element-ui/lib/index.js"></script>
    <script src="../app/lib/ZohoCrmHelper.js" type="text/javascript"></script>
    <script src="../app/lib/ZSDK.js" type="text/javascript"></script>
    <script src="../app/lib/jquery-1.10.2.js" type="text/javascript"></script>
    <script src="../app/lib/ZohoEmbededAppSDK.min.js" type="text/javascript"></script>
    <script src="../app/lib/axios.min.js" type="text/javascript"></script>
    <title>测试页面</title>
</head>

<body>
<div id="app">

    <el-tree :data="data" :props="defaultProps" @node-click="handleNodeClick" default-expand-all="true"></el-tree>


</div>


</body>
</html>


<script type="text/javascript">
    const app = new Vue({
        el: '#app',
        data() {
            return {
                crmId: "",


                data: [{
                    id: 1,
                    label: '中国中信集团有限公司',
                    children: [
                        {id: 2, label: '中信那曲大酒店'},
                        {id: 3, label: '中广移动网络有限公司'},
                        {
                            label: '国联事业有限公司',
                            children: [
                                {label: '国联事业有限公司1'},
                                {label: '国联事业有限公司2'},
                                {label: '国联事业有限公司3'},
                                {label: '国联事业有限公司4'},
                            ]
                        },
                        {
                            label: '中企网络通信技术有限公司',
                            children: [
                                {label: '中企网络通信技术有限公司1'},
                                {label: '中企网络通信技术有限公司2'},
                                {label: '中企网络通信技术有限公司3'},
                                {label: '中企网络通信技术有限公司4'},
                            ]
                        },
                        {
                            label: '中心矿业科技发展有限公司',
                            children: [
                                {label: '中心矿业科技发展有限公司1'},
                                {label: '中心矿业科技发展有限公司2'},
                                {label: '中心矿业科技发展有限公司3'},
                                {label: '中心矿业科技发展有限公司4'},
                            ]
                        },
                    ]
                },],
                defaultProps: {
                    children: 'children',
                    label: 'label'
                }
            };
        }
        ,
        mounted() {
            // this.testData();
            this.initData();
            ZOHO.embeddedApp.init();
        },
        methods: {
            handleNodeClick(data) {
                console.log(data.id);
                window.open('https://www.baidu.com/s?wd=' + data.id);
            },
            initData() {
                ZOHO.embeddedApp.on("PageLoad", function (data) {
                    this.crmId = data.EntityId;
                    // app.callFunction();
                    app.queryAllData();
                });
            },
            // 小部件调函数
            callFunction() {
                let func_name = "testPage";				// 函数名
                let req_data = {"id": this.crmId};// 参数
                ZOHO.CRM.FUNCTIONS.execute(func_name, req_data)
                    .then(function (data) {
                        // console.log("data=" + JSON.stringify(data));
                        let countData = data.details.output;
                        console.log("countData=" + countData);
                    })
            },
            // 查询所有数据
            async queryAllData() {

                let page = 1;
                let listData = [];
                let flag = true;
                while (flag) {
                    await ZOHO.CRM.API.getAllRecords({
                        Entity: "Accounts",
                        page: page,
                        per_page: 200
                    }).then(function (data) {
                        if (data.status === 204) {
                            flag = false;
                        } else if (data.data !== undefined) {
                            page++;
                            listData.push(...data.data)
                        }
                    })
                }
                console.log(listData.length);
            },

            testData() {
                // axios.get('http://localhost:9001/zz/myClue', {
                //     params: {
                //         name: '张三'
                //     }
                // }).then(res => {
                //         // 接口数据
                //         console.log(res.data.data)
                //     })
                let data = {
                    name: "张三"
                };

                // axios({
                //     url: "http://localhost:9001/zz/myClue",
                //     method: 'GET',
                //     headers: {
                //         'Content-Type': 'application/json'
                //     },
                //     params: data
                // }).then(response => {
                //     console.log(response.data);
                // }).catch(error => {
                //     console.log(error);
                // });
                //
                //
                // fetch('http://localhost:9001/zz/myClue', {
                //     method: 'post',
                //     headers: {
                //         'content-type': 'application/json'
                //     },
                //     body: JSON.stringify({
                //         'projectName': "项目名称"
                //     })
                // }).then((response) =>
                //     response.json()
                // ).catch((error) => {
                //     console.log(error)
                // })

            }


        }
    });

</script>
<style>

</style>


